<template>
    <div id="tmpl">
      <ul class="mui-table-view">
        <li v-for="item in list" class="mui-table-view-cell mui-media">
          <router-link v-bind="{to:'/news/newsinfo/'+item.ID}">
            <img class="mui-media-object mui-pull-left" :src="item.img_url">
            <div class="mui-media-body">
             {{item.title}}
              <p class='mui-ellipsis'>{{item.zhaiyao}}</p>
              <div class="ft">
                <span>发表时间:{{item.add_time}}</span>&nbsp;&nbsp;&nbsp;
                <span>点击数:{{item.click}}</span>
              </div>
            </div>
          </router-link>

        </li>
      </ul>
    </div>
</template>

<script>
    export default{
        data(){
            return{
             list:[],

            }
        },
      mounted(){
            this.getData()
      },
      methods:{
        getData(){
            this.$http.get('/api/newslist').then(res=>{
                this.list=res.data
            })
        },
      },
    }
</script>

<style scoped>
  .mui-table-view .mui-media-object{
    max-width: 100px;
    height: 75px;
  }
  .ft{
    color: #0094ff;
    float: left;
margin-top: 12px;
    font-size: 13px;

  }
</style>
